<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style >
body {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 12px;
}

h1 {
  font-size: 1.5em;
}
h2 {
  font-size: 1.2em;
}
</style>
<script>

	function reSize(size){
		return function(){
			document.body.style.fontSize = size+"px";
		};
	}
	
	window.onload= function(e){
		
		var font12 = reSize(12);
		var font16 = reSize(14);
		var font20 = reSize(16);
		
		document.getElementById("size-12").onclick=font12;
		document.getElementById("size-14").onclick=font16;
		document.getElementById("size-16").onclick=font20;
	}
	
</script>
</head>
<body>
	<p>Some paragraph text</p>
    <h1>some heading 1 text</h1>
    <h2>some heading 2 text</h2>

    <a href="#" id="size-12">12</a>
    <a href="#" id="size-14">14</a>
    <a href="#" id="size-16">16</a>
</body>
</html>